<% layout('/layouts/default.html', {title: '拆而未尽', libs: ['dataGrid']}){ %>
<!--<div class="main-content">-->
<!--	<div class="box box-main">-->
<!--		<div class="box-header">-->
<!--			<div class="box-title">-->
<!--				<i class="fa icon-notebook"></i> ${text('拆而未尽专项统计')}-->
<!--			</div>-->
<!--		</div>-->
<!--		</div>-->
<!--	</div>-->
<!--</div>-->
<style>
	.bindOne{
		border-radius: 4px;
		margin: 0px 5px 10px 5px;
		height: 300px;
		text-align: center;
		background: #fff;
		-webkit-transition: -webkit-transform .3s;
		transition: -webkit-transform .3s;
		transition: transform .3s;
		transition: transform .3s,-webkit-transform .3s;
		padding: 0 10px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.BoxTitAll{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		height: 15%;
		height: 40px;
	}
	.tabBody li{
		display: inline-block;
		margin-right: 20px;
		font-size:14px;
	}
	.tabActive{
		color: #1F69E6;
		border-bottom: 2px solid #1F69E6;
	}
	.defaultColor_text{
		font-size: 14px;
		margin: 0 8px;
		color: #000000;
		line-height: 40px;
		height: 40px;
	}
	.handTable{
		width: 100%;
		height: 85%;
	}
	.tableTwo{
		width: 100%;
		height: 80%;
	}
	.col-md-6,.col-md-4,.col-md-8{
		padding: 5px 10px 0px 2px!important;
	}

	.jqgridborder{
		border-bottom: 1px dashed #CCC !important;
	}

	.ui-jqgrid .ui-priority-secondary{
		background: white !important;
	}

	.ui-row-ltr{
		border: 0px !important;
	}

	#gview_noticeNotice .ui-jqgrid-hbox{
		display: none;
	}

	#gbox_noticeNotice{
		border: none;
	}

	#gview_todolist .ui-jqgrid-hbox{
		display: none;
	}

	#gbox_todolist{
		border: none;
	}

	#todolist tr td{
		border: none;
		border-bottom: 1px dashed #CCC;
	}

	#noticeNotice tr td{
		border: none;
	}

	#noticeNotice tr td{
		border-bottom: 1px dashed #CCC;
	}

	.jqgfirstrow td{
		border-bottom: none !important;
	}

	#taskAlertInformationDataGrid tr{
		cursor:pointer;
	}

	#noticeNotice tr{
		cursor:pointer;
	}

	#todolist tr{
		cursor:pointer;
	}

	#noticeNotice tr:hover{
		text-decoration:underline;
		color: rgb(31, 105, 230);
	}

	#todolist tr:hover{
		text-decoration:underline;
		color: rgb(31, 105, 230);
	}
/*全市概况*/
.handZong{
	width: 100%;
	padding-left:10px;
	padding-bottom: 10px;
	height: 70px;
}
	.handZong p{
		text-align: left;
		font-size: 20px;
		font-weight: bold;
	}
	.handZong p span {
       display: inline-block;
		padding-right:10px
	}
	.handZong p span b{
		display: inline-block;
		padding:0px 20px;
	}
	.blue{
		color: #0066cc;
	}
	.green{
		color: #008a00;
	}
	.red{
		color: #e60000;
	}
	.bindQuan{
		border-radius: 4px;
		margin: 0px 5px 16px 5px;
		text-align: center;
		-webkit-transition: -webkit-transform .3s;
		transition: -webkit-transform .3s;
		transition: transform .3s;
		transition: transform .3s,-webkit-transform .3s;
		padding: 0 10px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		background: #fff;
	}
	.bindge{
		border-radius: 4px;
		margin: 0px 5px 16px 5px;
		text-align: center;
		-webkit-transition: -webkit-transform .3s;
		transition: -webkit-transform .3s;
		transition: transform .3s;
		transition: transform .3s,-webkit-transform .3s;
		padding: 0 10px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		background: #fff;
		/*height: 410px;*/
	}
	.jingTitle{
		line-height: 100px;
		text-align: center;
		font-weight: 800;
		font-size: 20px;
		background: #ffffff;
		margin-bottom: 16px;
	}
	.conceptList li{
		width: 50%;
		float: left;
		font-size: 20px;
		font-weight: bold;
		list-style: none;
		text-align: left;
		line-height: 50px;
		color: #cccccc;
	}
	.conceptList li span{
		display: inline-block;
		padding-left:15px;
	}
</style>
<div class="content pb0">
	<div class="box box-main">
		<div class="box-header">
			<ul class="nav nav-tabs bangPing-tabs">
				<li class="active"><a href="${ctx}/dataview/dcSupImportData/pageOne">${text('专项统计')}</a></li>
				<li ><a href="${ctx}/dataview/dcSupImportData/pageTwo">${text('数据分析')}</a></li>
				<li ><a href="${ctx}/dataview/dcSupImportData/pageThree">${text('各区对比')}</a></li>
				<% if(hasRole('data_board_import') || @UserUtils.getUser().getUserCode() == 'system'){ %>
					<li ><a href="${ctx}/dataview/dcSupImportData/list">${text('数据导入')}</a></li>
				<% } %>
			</ul>
		</div>
	</div>
	<div class="row">
		<div class="col-md-8">
			<div class="bindQuan">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">全市概况</h1>
				</div>
				<div class="handZong">
					<p><span>总项目数<b class="blue" id="c10"></b></span><span>总户数<b class="blue" id="c11"></b></span><span>已完成户数<b class="green" id="c12"></b></span><span>剩余户数<b class="red" id="c13"></b></span><span>完成率<b class="red" id="c1"></b></span></p>
				</div>
			</div>
			<div class="bindge" style="height: 410px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">各区概览</h1>
				</div>
				<div class="handTable">
					<table id="overviewDataGrid"></table>
				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 260px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">全市-每日完成户数</h1>
				</div>
				<div class="handTable" id="everydayEchart">
				</div>
			</div>
			<div class="bindge" style="height: 260px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">各区剩余户数占比</h1>
				</div>
				<div class="handTable" id="surplus">

				</div>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<p class="jingTitle">镜湖区</p>
		</div>
	</div>
	<div class="row">
		<div class="col-md-4">
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">镜湖区概况</h1>
				</div>
				<div class="handTable">
					<ul class="conceptList">
						<li>项目数<span id="jhc10"></span></li>
						<li>目标户数<span id="jhc11"></span></li>
						<li>已完成户数<span id="jhc12"></span></li>
						<li>剩余数<span id="jhc13"></span></li>
					</ul>
				</div>
			</div>
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">镜湖区户数完成率</h1>
				</div>
				<div class="handTable" id="complete">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">镜湖区每日完成户数</h1>
				</div>
				<div class="handTable" id="households">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">镜湖区反馈问题</h1>
				</div>
				<div class="tableTwo">
					<table id="listDataGrid"></table>
				</div>
			</div>
		</div>
	</div>
<!--弋江区	-->
	<div class="row">
		<div class="col-md-12">
			<p class="jingTitle">弋江区</p>
		</div>
	</div>
	<div class="row">
		<div class="col-md-4">
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">弋江区概况</h1>
				</div>
				<div class="handTable">
					<ul class="conceptList">
						<li>项目数<span id="yijc10"></span></li>
						<li>目标户数<span id="yijc11"></span></li>
						<li>已完成户数<span id="yijc12"></span></li>
						<li>剩余数<span id="yijc13"></span></li>
					</ul>
				</div>
			</div>
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">弋江区户数完成率</h1>
				</div>
				<div class="handTable" id="complete2">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">弋江区每日完成户数</h1>
				</div>
				<div class="handTable" id="households2">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">弋江区反馈问题</h1>
				</div>
				<div class="tableTwo">
					<table  id="surplusDataGrid"></table>
				</div>
			</div>
		</div>
	</div>
	<!--鸠江区	-->
	<div class="row">
		<div class="col-md-12">
			<p class="jingTitle">鸠江区</p>
		</div>
	</div>
	<div class="row">
		<div class="col-md-4">
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">鸠江区概况</h1>
				</div>
				<div class="handTable">
					<ul class="conceptList">
						<li>项目数<span id="yiujc10"></span></li>
						<li>目标户数<span id="yiujc11"></span></li>
						<li>已完成户数<span id="yiujc12"></span></li>
						<li>剩余数<span id="yiujc13"></span></li>
					</ul>
				</div>
			</div>
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">鸠江区户数完成率</h1>
				</div>
				<div class="handTable" id="complete3">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">鸠江区每日完成户数</h1>
				</div>
				<div class="handTable" id="households3">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">鸠江区反馈问题</h1>
				</div>
				<div class="tableTwo" >
					<table  id="houseDataGrid"></table>
				</div>
			</div>
		</div>
	</div>
	<!--三山经济开发区	-->
	<div class="row">
		<div class="col-md-12">
			<p class="jingTitle">三山经济开发区</p>
		</div>
	</div>
	<div class="row">
		<div class="col-md-4">
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">三山经济开发区概况</h1>
				</div>
				<div class="handTable">
					<ul class="conceptList">
						<li>项目数<span id="sana10"></span></li>
						<li>目标户数<span id="sana11"></span></li>
						<li>已完成户数<span id="sana12"></span></li>
						<li>剩余数<span id="sana13"></span></li>
					</ul>
				</div>
			</div>
			<div class="bindge" style="height: 250px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">三山经济开发区户数完成率</h1>
				</div>
				<div class="handTable" id="complete4">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">三山经济开发区每日完成户数</h1>
				</div>
				<div class="handTable" id="households4">

				</div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="bindge" style="height: 514px">
				<div class="BoxTitAll">
					<h1 class="defaultColor_text">三山经济开发区反馈问题</h1>
				</div>
				<div class="tableTwo" >
					<table  id="sansDataGrid"></table>
				</div>
			</div>
		</div>
	</div>


</div>
<% } %>
<script src="${ctxStatic}/jquery/jquery-ui-sortable-1.12.1.min.js"></script>
<script src="${ctxStatic}/echarts/4.2/echarts.min.js"></script>
<script>
	var surplus,complete,everydayEchart,households,households2,households3,households4,households5,complete,complete2,complete3,complete4,complete5;
	 $(function(){
		window.addEventListener("resize", () => {
			everydayEchart.resize();
			surplus.resize();
			households.resize();
			households2.resize();
			households3.resize();
			households4.resize();
			households5.resize();
			complete.resize();
			complete2.resize();
			complete3.resize();
			complete4.resize();
			complete5.resize();
		});
    });
// <!--	各区剩余户数占比-->
	
$.ajax({
	type: 'get',
	url: "${ctx}/dataview/dcSupImportData/query1",
	success:function(res){
		$("#c1").text(res.data.c1);
		$("#c10").text(res.data.c10);
		$("#c11").text(res.data.c11);
		$("#c12").text(res.data.c12);
		$("#c13").text(res.data.c13);

	}
});
$.ajax({
	type: 'get',
	url: "${ctx}/dataview/dcSupImportData/query2",
	success:function(res){
		getEverydayEchart(res)
	}
});
$.ajax({
	type: 'get',
	url: "${ctx}/dataview/dcSupImportData/query4",
	success:function(res){
		getSurplus(res)
	}
});

$.ajax({
	type: 'get',
	url: "${ctx}/dataview/dcSupImportData/query5",
	success:function(res){
		$("#jhc10").text(res.jinhu.c10);
		$("#jhc11").text(res.jinhu.c11);
		$("#jhc12").text(res.jinhu.c12);
		$("#jhc13").text(res.jinhu.c13);

		$("#yijc10").text(res.yijiang.c10);
		$("#yijc11").text(res.yijiang.c11);
		$("#yijc12").text(res.yijiang.c12);
		$("#yijc13").text(res.yijiang.c13);


		$("#yiujc10").text(res.jiujiang.c10);
		$("#yiujc11").text(res.jiujiang.c11);
		$("#yiujc12").text(res.jiujiang.c12);
		$("#yiujc13").text(res.jiujiang.c13);


		$("#sana10").text(res.snashan.c10);
		$("#sana11").text(res.snashan.c11);
		$("#sana12").text(res.snashan.c12);
		$("#sana13").text(res.snashan.c13);


		$("#daq10").text(res.daqiao.c10);
		$("#daq11").text(res.daqiao.c11);
		$("#daq12").text(res.daqiao.c12);
		$("#daq13").text(res.daqiao.c13);
	}
});
$.ajax({
	type: 'get',
	url: "${ctx}/dataview/dcSupImportData/query6",
	success:function(res){
		getHouseholds(res)
		getHouseholds2(res)
		getHouseholds3(res)
		getHouseholds4(res)
	}
});

//全市-每日完成户数

function getEverydayEchart(data) {
	everydayEchart = echarts.init(document.getElementById('everydayEchart'), 'default');
	everydayEchart.setOption({
		color:["#FFA223"],
		tooltip: {
			trigger: 'item'
		},
		xAxis: {
			type: 'category',
			data: data.nameList,
		},
		yAxis: {
			type: 'value'
		},
		series: [
			{
				data: data.valueList,
				type: 'bar',
			}
		]
	})
}
// 各区概览
$('#overviewDataGrid').dataGrid({
	url:"${ctx}/dataview/dcSupImportData/query3",
	sortableColumn: false, // 列表不允许排序
	autoGridHeight: function(){
		return $('.handTable').height()-50;
	},
	showRownum: false,
	emptyDataHint: true, 	// 表格内没有数据的时候是否提示 “无数据显示”  v4.1.7
	emptyDataHintContent: '<center>'+$.jgrid.defaults.emptyrecords+'</center>',
	columnModel: [
		{header:'${text("区属")}', name:'c2', width:150, align:"center",},
		{header:'${text("项目总数")}', name:'param1',  width:150, align:"center"},
		{header:'${text("总户数")}', name:'param2',  width:150, align:"center"},
		{header:'${text("已完成户数")}', name:'param3',  width:150, align:"center"},
		{header:'${text("剩余户数")}', name:'param4', width:150, align:"center",formatter: function(val, obj, row, act){
			return '<span  style="color: #fc8b2d">'+row.param4+'</span>';
		}
		},
		{header:'${text("累计完成率（%")}', name:'param5',  width:150, align:"center",formatter: function(val, obj, row, act){
			return '<span  style="color: #329004">'+row.param5+'</span>';
		}
		},
		{header:'${text("2020年完成户数")}', name:'param6',  width:150, align:"center"},
		{header:'${text("2020年实际任务数")}', name:'param7',  width:150, align:"center"},
		{header:'${text("完成率（%）")}', name:'param8',  width:150, align:"center",formatter: function(val, obj, row, act){
				return '<span  style="color: #329004">'+row.param8+'</span>';
			}
		},
	],
	// 加载成功后执行事件
	ajaxSuccess: function(data){

	},

});
// listDataGrid 镜湖区反馈问题 
$('#listDataGrid').dataGrid({
	url:"${ctx}/dataview/dcSupImportData/query7?c2=镜湖区",
	sortableColumn: false, // 列表不允许排序
	autoGridHeight: function(){
		return $('.tableTwo').height() -0;
	},
	showRownum: false,
	emptyDataHint: true, 	// 表格内没有数据的时候是否提示 “无数据显示”  v4.1.7
	emptyDataHintContent: '<center>'+$.jgrid.defaults.emptyrecords+'</center>',
	columnModel: [
		{header:'${text("日期")}', name:'c28', width:150, align:"center",},
		{header:'${text("反馈问题")}', name:'c24',  width:150, align:"center"},
		{header:'${text("项目名称")}', name:'c4',  width:150, align:"center"},
	
	],
	// 加载成功后执行事件
	ajaxSuccess: function(data){

	},

});
// surplusDataGrid 弋江区反馈问题
$('#surplusDataGrid').dataGrid({
	url:"${ctx}/dataview/dcSupImportData/query7?c2=弋江区",
	sortableColumn: false, // 列表不允许排序
	autoGridHeight: function(){
		return $('.tableTwo').height();
	},
	showRownum: false,
	emptyDataHint: true, 	// 表格内没有数据的时候是否提示 “无数据显示”  v4.1.7
	emptyDataHintContent: '<center>'+$.jgrid.defaults.emptyrecords+'</center>',
	columnModel: [
		{header:'${text("日期")}', name:'c28', width:150, align:"center",},
		{header:'${text("反馈问题")}', name:'c24',  width:150, align:"center"},
		{header:'${text("项目名称")}', name:'c4',  width:150, align:"center"},
	
	],
	// 加载成功后执行事件
	ajaxSuccess: function(data){

	},

});
// 鸠江区反馈问题
$('#houseDataGrid').dataGrid({
	url:"${ctx}/dataview/dcSupImportData/query7?c2=鸠江区",
	sortableColumn: false, // 列表不允许排序
	autoGridHeight: function(){
		return $('.tableTwo').height();
	},
	showRownum: false,
	emptyDataHint: true, 	// 表格内没有数据的时候是否提示 “无数据显示”  v4.1.7
	emptyDataHintContent: '<center>'+$.jgrid.defaults.emptyrecords+'</center>',
	columnModel: [
		{header:'${text("日期")}', name:'c28', width:150, align:"center",},
		{header:'${text("反馈问题")}', name:'c24',  width:150, align:"center"},
		{header:'${text("项目名称")}', name:'c4',  width:150, align:"center"},
	
	],
	// 加载成功后执行事件
	ajaxSuccess: function(data){

	},

});
// 三山经济开发区反馈问题
$('#sansDataGrid').dataGrid({
	url:"${ctx}/dataview/dcSupImportData/query7?c2=三山经济开发区",
	sortableColumn: false, // 列表不允许排序
	autoGridHeight: function(){
		return $('.tableTwo').height();
	},
	showRownum: false,
	emptyDataHint: true, 	// 表格内没有数据的时候是否提示 “无数据显示”  v4.1.7
	emptyDataHintContent: '<center>'+$.jgrid.defaults.emptyrecords+'</center>',
	columnModel: [
		{header:'${text("日期")}', name:'c28', width:150, align:"center",},
		{header:'${text("反馈问题")}', name:'c24',  width:150, align:"center"},
		{header:'${text("项目名称")}', name:'c4',  width:150, align:"center"},
	
	],
	// 加载成功后执行事件
	ajaxSuccess: function(data){

	},

});

//各区剩余户数占比
	function getSurplus(data) {
		surplus = echarts.init(document.getElementById('surplus'), 'default');
		surplus.setOption({
			tooltip: {
				trigger: 'item',
				formatter: '{b}:{c}' + '\n\r' + '({d}%)'
			},
			color:["#FFB226","#D164F8","#509AF2","#3ACF7A"],
			legend: {
				orient: 'vertical',
				left: 'right',

			},
			series: [
				{
					type: 'pie',
					radius: '50%',
					data: data.list,
					label: {
						normal: {
							show: true,
							formatter: '{c}' + '\n\r' + '({d}%)'
						}
					}
				}
			]
		})
	}
//镜湖区户数完成率
$.ajax({
	type: 'get',
	url: "${ctx}/dataview/dcSupImportData/query8",
	success:function(res){
		getComplete(res)
		getComplete2(res)
		getComplete3(res)
		getComplete4(res)
		getComplete5(res)

	}
});

function getComplete(item) {
	complete = echarts.init(document.getElementById('complete'), 'default');
	complete.setOption({
		tooltip: {
			trigger: 'item',
			formatter: '{b}:{c}' + '\n\r' + '({d}%)'
		},
		grid: {
			bottom: '20%'
		},
		series: [
			{
				type: 'pie',
				radius: ['40%', '60%'],
				avoidLabelOverlap: true,
				label: {
					show: false,
					position: 'center',
					normal: {
                          show: true,
                          length: 20,
                          length2: 20,
                          lineStyle: {
                              color: '#333'
                          },
						  formatter:  '{b}:{c}' + '\n\r' + '({d}%)'
                    },
					
				},
				itemStyle: {
					normal: {
						color: function (params) {
							var colorList = [
								'#4b87ff',
								'#FFB226',
							];
							return colorList[params.dataIndex]
						},
					}
				},
				labelLine: {
					show: true
				},
				data: [
					{ value: item.jinhu.c29, name: '户数未完成率' },
					{ value: item.jinhu.c28, name: '户数完成率' },
				],

			}
		]
	})
}
function getComplete2(item) {
	complete2 = echarts.init(document.getElementById('complete2'), 'default');
	complete2.setOption({
		tooltip: {
			trigger: 'item',
			formatter: '{b}:{c}' + '\n\r' + '({d}%)'
		},
		grid: {
			bottom: '20%'
		},
		series: [
			{
				type: 'pie',
				radius: ['40%', '60%'],
				avoidLabelOverlap: true,
				label: {
					show: false,
					position: 'center',
					normal: {
                          show: true,
                          length: 20,
                          length2: 20,
                          lineStyle: {
                              color: '#333'
                          },
						  formatter:  '{b}:{c}' + '\n\r' + '({d}%)'
                    },
					
				},
				itemStyle: {
					normal: {
						color: function (params) {
							var colorList = [
								'#4b87ff',
								'#FFB226',
							];
							return colorList[params.dataIndex]
						},
					}
				},
				labelLine: {
					show: true
				},
				data: [
					{ value: item.yijiang.c29, name: '户数未完成率' },
					{ value: item.yijiang.c28, name: '户数完成率' },
				],

			}
		]
	})
}
function getComplete3(item) {
	complete3 = echarts.init(document.getElementById('complete3'), 'default');
	complete3.setOption({
		tooltip: {
			trigger: 'item',
			formatter: '{b}:{c}' + '\n\r' + '({d}%)'
		},
		grid: {
			bottom: '20%'
		},
		series: [
			{
				type: 'pie',
				radius: ['40%', '60%'],
				avoidLabelOverlap: true,
				label: {
					show: false,
					position: 'center',
					normal: {
                          show: true,
                          length: 20,
                          length2: 20,
                          lineStyle: {
                              color: '#333'
                          },
						  formatter:  '{b}:{c}' + '\n\r' + '({d}%)'
                    },
					
				},
				itemStyle: {
					normal: {
						color: function (params) {
							var colorList = [
								'#4b87ff',
								'#FFB226',
							];
							return colorList[params.dataIndex]
						},
					}
				},
				labelLine: {
					show: true
				},
				data: [
					{ value: item.jiujiang.c29, name: '户数未完成率' },
					{ value: item.jiujiang.c28, name: '户数完成率' },
				],

			}
		]
	})
}
function getComplete4(item) {
	complete4 = echarts.init(document.getElementById('complete4'), 'default');
	complete4.setOption({
		tooltip: {
			trigger: 'item',
			formatter: '{b}:{c}' + '\n\r' + '({d}%)'
		},
		grid: {
			bottom: '20%'
		},
		series: [
			{
				type: 'pie',
				radius: ['40%', '60%'],
				avoidLabelOverlap: true,
				label: {
					show: false,
					position: 'center',
					normal: {
                          show: true,
                          length: 20,
                          length2: 20,
                          lineStyle: {
                              color: '#333'
                          },
						  formatter:  '{b}:{c}' + '\n\r' + '({d}%)'
                    },
					
				},
				itemStyle: {
					normal: {
						color: function (params) {
							var colorList = [
								'#4b87ff',
								'#FFB226',
							];
							return colorList[params.dataIndex]
						},
					}
				},
				labelLine: {
					show: true
				},
				data: [
					{ value: item.snashan.c29, name: '户数未完成率' },
					{ value: item.snashan.c28, name: '户数完成率' },
				],

			}
		]
	})
}
function getComplete5(item) {
	complete5 = echarts.init(document.getElementById('complete5'), 'default');
	complete5.setOption({
		tooltip: {
			trigger: 'item',
			formatter: '{b}:{c}' + '\n\r' + '({d}%)'
		},
		grid: {
			bottom: '20%'
		},
		series: [
			{
				type: 'pie',
				radius: ['40%', '60%'],
				avoidLabelOverlap: true,
				label: {
					show: false,
					position: 'center',
					normal: {
                          show: true,
                          length: 20,
                          length2: 20,
                          lineStyle: {
                              color: '#333'
                          },
						  formatter:  '{b}:{c}' + '\n\r' + '({d}%)'
                    },
					
				},
				itemStyle: {
					normal: {
						color: function (params) {
							var colorList = [
								'#4b87ff',
								'#FFB226',
							];
							return colorList[params.dataIndex]
						},
					}
				},
				labelLine: {
					show: true
				},
				data: [
					{ value: item.daqiao.c29, name: '户数未完成率' },
					{ value: item.daqiao.c28, name: '户数完成率' },
				],

			}
		]
	})
}

//镜湖区每日完成户数
function getHouseholds(data) {
	households = echarts.init(document.getElementById('households'), 'default');
	households.setOption({
		color:['#509AF2'],
		tooltip: {
			trigger: 'item'
		},
		legend: {
			data: ['镜湖区' ]
		},
		xAxis: {
			type: 'category',
			data: data.nameListjinhu,
		},
		yAxis: {
			type: 'value'
		},
		series: [
			{
				data: data.valueListjinhu,
				type: 'bar',
				name: '镜湖区',
			}
		]
	})
}

function getHouseholds2(data) {
	households2 = echarts.init(document.getElementById('households2'), 'default');
	households2.setOption({
		color:['#509AF2'],
		tooltip: {
			trigger: 'item'
		},
		legend: {
			data: ['弋江区' ]
		},
		xAxis: {
			type: 'category',
			data: data.nameListyijiang,
		},
		yAxis: {
			type: 'value'
		},
		series: [
			{
				data: data.valueListyijiang,
				type: 'bar',
				name: '弋江区',
			}
		]
	})
}
function getHouseholds3(data) {
	households3 = echarts.init(document.getElementById('households3'), 'default');
	households3.setOption({
		color:['#509AF2'],
		tooltip: {
			trigger: 'item'
		},
		legend: {
			data: ['鸠江区' ]
		},
		xAxis: {
			type: 'category',
			data: data.nameListjiujiang,
		},
		yAxis: {
			type: 'value'
		},
		series: [
			{
				data: data.valueListjiujiang,
				type: 'bar',
				name: '鸠江区',
			}
		]
	})
}
function getHouseholds4(data) {
	households4 = echarts.init(document.getElementById('households4'), 'default');
	households4.setOption({
		color:['#509AF2'],
		tooltip: {
			trigger: 'item'
		},
		legend: {
			data: ['三山经济开发区' ]
		},
		xAxis: {
			type: 'category',
			data: data.nameListsanshan,
		},
		yAxis: {
			type: 'value'
		},
		series: [
			{
				data: data.valueListsanshan,
				type: 'bar',
				name: '三山经济开发区',
			}
		]
	})
}

</script>

